<template>
  <DesignCompWrapper v-model="compInfo">
    <div
      :class="[
        { 'border-dashed border border-gray-400 bg-green-200': compInfo.showToolBtn },
        compInfo.configData.classArr
      ]"
      :style="compStyle"
    >
      {{ textCompConfig.content }}
    </div>
  </DesignCompWrapper>
</template>

<script setup lang="ts">
import { buildBaseConfigStyle } from '@/utils/DesignCompUtil'

const compInfo = defineModel<DesignComp>({
  required: true
})
const textCompConfig = computed(() => compInfo.value.configData as TextCompConfig)
const compStyle = computed(() => {
  const compSettings = compInfo.value.configData
  return buildBaseConfigStyle(compSettings)
})
</script>

<style scoped></style>
